<!DOCTYPE html>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>若依系统首页</title>
    <!-- 避免IE使用兼容模式 -->

	<link rel="preconnect" href="https://fonts.gstatic.com">
	<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap"
		  rel="stylesheet">
	<link rel="stylesheet" th:href="@{/css/bootstrap.css}">
	<link rel="stylesheet" th:href="@{/css/vendors/perfect-scrollbar/perfect-scrollbar.css}">
	<link rel="stylesheet" th:href="@{/css/vendors/bootstrap-icons/bootstrap-icons.css}">
	<link rel="stylesheet" th:href="@{/css/app.css}">
	<link rel="shortcut icon" th:href="@{/img/favicon.svg}" type="image/x-icon">
	<style>
		#content-main {
			height: calc(100% - 127px);
			overflow: hidden;
		}
		#app,#main,.page-heading,html,body{
			height: 100%;
		}
	</style>
</head>
<body class="fixed-sidebar full-height-layout gray-bg" th:classappend="${isMobile} ? 'canvas-menu'" style="overflow: hidden">
<div id="app">
	<div id="sidebar" class="active">
		<div class="sidebar-wrapper active">
			<div class="sidebar-header">
				<div class="d-flex justify-content-between">
					<div class="logo">
						<a href="index.html"><img src="../static/img/logo/logo.png" th:src="@{/img/logo/logo.png}" alt="Logo" srcset=""></a>
					</div>
					<div class="toggler">
						<a href="#" class="sidebar-hide d-xl-none d-block"><i class="bi bi-x bi-middle"></i></a>
					</div>
				</div>
			</div>
			<div class="sidebar-menu">
				<ul class="menu">
					<li class="sidebar-title">Menu</li>

					<li class="sidebar-item  ">
						<a href="index.html" class='sidebar-link'>
							<i class="bi bi-grid-fill"></i>
							<span>Dashboard</span>
						</a>
					</li>

					<li class="sidebar-item active has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-stack"></i>
							<span>系统管理</span>
						</a>
						<ul class="submenu active">
							<li class="submenu-item active">
								<a href="javascript:goUrl('/system/menu');">角色管理</a>
							</li>
							<li class="submenu-item ">
								<a href="javascript:goUrl('/system/user');">用户管理</a>
							</li>
							<li class="submenu-item ">
								<a class="menuItem" th:href="@{/system/role}">菜单管理</a>
							</li>
							<li class="submenu-item ">
								<a href="component-button.html">Button</a>
							</li>
							<li class="submenu-item ">
								<a href="component-card.html">Card</a>
							</li>
							<li class="submenu-item ">
								<a href="component-carousel.html">Carousel</a>
							</li>
							<li class="submenu-item ">
								<a href="component-dropdown.html">Dropdown</a>
							</li>
							<li class="submenu-item ">
								<a href="component-list-group.html">List Group</a>
							</li>
							<li class="submenu-item ">
								<a href="component-modal.html">Modal</a>
							</li>
							<li class="submenu-item ">
								<a href="component-navs.html">Navs</a>
							</li>
							<li class="submenu-item ">
								<a href="component-pagination.html">Pagination</a>
							</li>
							<li class="submenu-item ">
								<a href="component-progress.html">Progress</a>
							</li>
							<li class="submenu-item ">
								<a href="component-spinner.html">Spinner</a>
							</li>
							<li class="submenu-item ">
								<a href="component-tooltip.html">Tooltip</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-collection-fill"></i>
							<span>Extra Components</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="extra-component-avatar.html">Avatar</a>
							</li>
							<li class="submenu-item ">
								<a href="extra-component-sweetalert.html">Sweet Alert</a>
							</li>
							<li class="submenu-item ">
								<a href="extra-component-toastify.html">Toastify</a>
							</li>
							<li class="submenu-item ">
								<a href="extra-component-rating.html">Rating</a>
							</li>
							<li class="submenu-item ">
								<a href="extra-component-divider.html">Divider</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-grid-1x2-fill"></i>
							<span>Layouts</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="layout-default.html">Default Layout</a>
							</li>
							<li class="submenu-item ">
								<a href="layout-vertical-1-column.html">1 Column</a>
							</li>
							<li class="submenu-item ">
								<a href="layout-vertical-navbar.html">Vertical Navbar</a>
							</li>
							<li class="submenu-item ">
								<a href="layout-rtl.html">RTL Layout</a>
							</li>
							<li class="submenu-item ">
								<a href="layout-horizontal.html">Horizontal Menu</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-title">Forms &amp; Tables</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-hexagon-fill"></i>
							<span>Form Elements</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="form-element-input.html">Input</a>
							</li>
							<li class="submenu-item ">
								<a href="form-element-input-group.html">Input Group</a>
							</li>
							<li class="submenu-item ">
								<a href="form-element-select.html">Select</a>
							</li>
							<li class="submenu-item ">
								<a href="form-element-radio.html">Radio</a>
							</li>
							<li class="submenu-item ">
								<a href="form-element-checkbox.html">Checkbox</a>
							</li>
							<li class="submenu-item ">
								<a href="form-element-textarea.html">Textarea</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  ">
						<a href="form-layout.html" class='sidebar-link'>
							<i class="bi bi-file-earmark-medical-fill"></i>
							<span>Form Layout</span>
						</a>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-pen-fill"></i>
							<span>Form Editor</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="form-editor-quill.html">Quill</a>
							</li>
							<li class="submenu-item ">
								<a href="form-editor-ckeditor.html">CKEditor</a>
							</li>
							<li class="submenu-item ">
								<a href="form-editor-summernote.html">Summernote</a>
							</li>
							<li class="submenu-item ">
								<a href="form-editor-tinymce.html">TinyMCE</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  ">
						<a href="table.html" class='sidebar-link'>
							<i class="bi bi-grid-1x2-fill"></i>
							<span>Table</span>
						</a>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-file-earmark-spreadsheet-fill"></i>
							<span>Datatables</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="table-datatable.html">Datatable</a>
							</li>
							<li class="submenu-item ">
								<a href="table-datatable-jquery.html">Datatable (jQuery)</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-title">Extra UI</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-pentagon-fill"></i>
							<span>Widgets</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="ui-widgets-chatbox.html">Chatbox</a>
							</li>
							<li class="submenu-item ">
								<a href="ui-widgets-pricing.html">Pricing</a>
							</li>
							<li class="submenu-item ">
								<a href="ui-widgets-todolist.html">To-do List</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-egg-fill"></i>
							<span>Icons</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="ui-icons-bootstrap-icons.html">Bootstrap Icons </a>
							</li>
							<li class="submenu-item ">
								<a href="ui-icons-fontawesome.html">Fontawesome</a>
							</li>
							<li class="submenu-item ">
								<a href="ui-icons-dripicons.html">Dripicons</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-bar-chart-fill"></i>
							<span>Charts</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="ui-chart-chartjs.html">ChartJS</a>
							</li>
							<li class="submenu-item ">
								<a href="ui-chart-apexcharts.html">Apexcharts</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  ">
						<a href="ui-file-uploader.html" class='sidebar-link'>
							<i class="bi bi-cloud-arrow-up-fill"></i>
							<span>File Uploader</span>
						</a>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-map-fill"></i>
							<span>Maps</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="ui-map-google-map.html">Google Map</a>
							</li>
							<li class="submenu-item ">
								<a href="ui-map-jsvectormap.html">JS Vector Map</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-title">Pages</li>

					<li class="sidebar-item  ">
						<a href="application-email.html" class='sidebar-link'>
							<i class="bi bi-envelope-fill"></i>
							<span>Email Application</span>
						</a>
					</li>

					<li class="sidebar-item  ">
						<a href="application-chat.html" class='sidebar-link'>
							<i class="bi bi-chat-dots-fill"></i>
							<span>Chat Application</span>
						</a>
					</li>

					<li class="sidebar-item  ">
						<a href="application-gallery.html" class='sidebar-link'>
							<i class="bi bi-image-fill"></i>
							<span>Photo Gallery</span>
						</a>
					</li>

					<li class="sidebar-item  ">
						<a href="application-checkout.html" class='sidebar-link'>
							<i class="bi bi-basket-fill"></i>
							<span>Checkout Page</span>
						</a>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-person-badge-fill"></i>
							<span>Authentication</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="auth-login.html">Login</a>
							</li>
							<li class="submenu-item ">
								<a href="auth-register.html">Register</a>
							</li>
							<li class="submenu-item ">
								<a href="auth-forgot-password.html">Forgot Password</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-item  has-sub">
						<a href="#" class='sidebar-link'>
							<i class="bi bi-x-octagon-fill"></i>
							<span>Errors</span>
						</a>
						<ul class="submenu ">
							<li class="submenu-item ">
								<a href="error-403.html">403</a>
							</li>
							<li class="submenu-item ">
								<a href="error-404.html">404</a>
							</li>
							<li class="submenu-item ">
								<a href="error-500.html">500</a>
							</li>
						</ul>
					</li>

					<li class="sidebar-title">Raise Support</li>

					<li class="sidebar-item  ">
						<a href="https://zuramai.github.io/mazer/docs" class='sidebar-link'>
							<i class="bi bi-life-preserver"></i>
							<span>Documentation</span>
						</a>
					</li>

					<li class="sidebar-item  ">
						<a href="https://github.com/zuramai/mazer/blob/main/CONTRIBUTING.md"
						   class='sidebar-link'>
							<i class="bi bi-puzzle"></i>
							<span>Contribute</span>
						</a>
					</li>

					<li class="sidebar-item  ">
						<a href="https://github.com/zuramai/mazer#donate" class='sidebar-link'>
							<i class="bi bi-cash"></i>
							<span>Donate</span>
						</a>
					</li>

				</ul>
			</div>
			<button class="sidebar-toggler btn x"><i data-feather="x"></i></button>
		</div>
	</div>

	<!--右侧部分结束-->
	<div id="main">
		<header class="mb-3 row">
			<a href="#" class="burger-btn d-block d-xl-none">
				<i class="bi bi-justify fs-3"></i>
			</a>
			<div class="page-title">
				<div class="row">
					<div class="col-12 col-md-6 order-md-2 order-last">
						<div class="dropdown float-end">
							<a href="#" class="user-dropdown d-flex dropend" data-bs-toggle="dropdown"
							   aria-expanded="false">
								<div class="avatar avatar-md2">
									<img th:src="(${#strings.isEmpty(user.avatar)}) ? @{/img/profile.jpg} : @{${user.avatar}}" th:onerror="this.src='img/profile.jpg'" alt="Avatar">
								</div>
<!--								<div class="text">-->
<!--									<h6 class="user-dropdown-name">John Ducky</h6>-->
<!--									<p class="user-dropdown-status text-sm text-muted">Member</p>-->
<!--								</div>-->
							</a>
							<ul class="dropdown-menu dropdown-menu-end shadow-lg"
								aria-labelledby="dropdownMenuButton1">
								<li><a class="dropdown-item" href="#">个人中心</a></li>
								<li><a class="dropdown-item" href="#">测试某某</a></li>
								<li>
									<hr class="dropdown-divider">
								</li>
								<li><a class="dropdown-item" href="auth-login.html">退出登录</a></li>
							</ul>
						</div>
					</div>
					<div class="col-12 col-md-6 order-md-1 order-last">
						<nav aria-label="breadcrumb" class="breadcrumb-header float-start">
							<ol class="breadcrumb">
								<li class="breadcrumb-item"><a href="index.html">系统管理</a></li>
								<li class="breadcrumb-item active" aria-current="page">角色管理</li>
							</ol>
						</nav>
					</div>
				</div>
			</div>
		</header>

		<div class="page-heading">
			<div class="row mainContent" id="content-main" th:classappend="${mainClass}">
				<iframe id="oframe" class="RuoYi_iframe" name="iframe0" width="100%" height="100%" th:data-id="@{/system/menu}"
						th:src="@{/system/menu}" frameborder="0" seamless></iframe>
			</div>
		</div>

		<footer>
			<div class="footer clearfix mb-0 text-muted">
				<div class="float-start">
					<p>2021 &copy; Mazer</p>
				</div>
				<div class="float-end">
					<p>Crafted with <span class="text-danger"><i class="bi bi-heart"></i></span> by <a
							href="http://ahmadsaugi.com">A. Saugi</a></p>
				</div>
			</div>
		</footer>
	</div>
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/css/vendors/perfect-scrollbar/perfect-scrollbar.min.js}"></script>
<script th:src="@{/js/mazer/bootstrap.bundle.min.js}"></script>
<script th:src="@{/js/mazer/mazer.js}"></script>
<script th:inline="javascript">
window.history.forward(1);
var ctx = [[@{/}]];
var lockscreen = [[${session.lockscreen}]]; 
if(lockscreen){window.top.location=ctx+"lockscreen";}
// 皮肤缓存
var skin = storage.get("skin");
// history（表示去掉地址的#）否则地址以"#"形式展示
var mode = "history";
// 历史访问路径缓存
var historyPath = storage.get("historyPath");
// 是否页签与菜单联动
var isLinkage = true;

// 本地主题优先，未设置取系统配置
if($.common.isNotEmpty(skin)){
	$("body").addClass(skin.split('|')[0]);
	$("body").addClass(skin.split('|')[1]);
} else {
	$("body").addClass([[${sideTheme}]]);
	$("body").addClass([[${skinName}]]);
}

/* 用户管理-重置密码 */
function resetPwd() {
    var url = ctx + 'system/user/profile/resetPwd';
    $.modal.open("重置密码", url, '770', '380');
}

/* 切换主题 */
function switchSkin() {
    layer.open({
		type : 2,
		shadeClose : true,
		title : "切换主题",
		area : ["530px", "386px"],
		content : [ctx + "system/switchSkin", 'no']
	})
}

/* 切换菜单 */
function toggleMenu() {
	$.modal.confirm("确认要切换成横向菜单吗？", function() {
		$.get(ctx + 'system/menuStyle/topnav', function(result) {
            window.location.reload();
	    });
	})
}

/** 刷新时访问路径页签 */
function applyPath(url) {
	$('a[href$="' + decodeURI(url) + '"]').click();
	if (!$('a[href$="' + url + '"]').hasClass("noactive")) {
	    $('a[href$="' + url + '"]').parent("li").addClass("selected").parents("li").addClass("active").end().parents("ul").addClass("in");
	}
}

function goUrl(url){
	document.getElementById("oframe").src = url
}

$(function() {
	var lockPath = storage.get('lockPath');
	if($.common.equals("history", mode) && window.performance.navigation.type == 1) {
		var url = storage.get('publicPath');
	    if ($.common.isNotEmpty(url)) {
	    	applyPath(url);
	    }
	} else if($.common.isNotEmpty(lockPath)) {
	    applyPath(lockPath);
	    storage.remove('lockPath');
	} else {
		var hash = location.hash;
	    if ($.common.isNotEmpty(hash)) {
	        var url = hash.substring(1, hash.length);
	        applyPath(url);
	    } else {
	    	if($.common.equals("history", mode)) {
	    		storage.set('publicPath', "");
	    	}
	    }
	}
	
	/* 初始密码提示 */
	if([[${isDefaultModifyPwd}]]) {
		layer.confirm("您的密码还是初始密码，请修改密码！", {
			icon: 0,
			title: "安全提示",
			btn: ['确认'	, '取消'],
			offset: ['30%']
		}, function (index) {
			resetPwd();
			layer.close(index);
		});
	}
	
	/* 过期密码提示 */
	if([[${isPasswordExpired}]]) {
		layer.confirm("您的密码已过期，请尽快修改密码！", {
			icon: 0,
			title: "安全提示",
			btn: ['确认'	, '取消'],
			offset: ['30%']
		}, function (index) {
			resetPwd();
			layer.close(index);
		});
	}
	$("[data-toggle='tooltip']").tooltip();
});
</script>
</body>
</html>
